<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('修改检索规则')" />
    <th:block th:include="include :: datetimepicker-css" />
    <th:block th:include="include :: select2-css" />
</head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal m" id="form-searchRule-edit" th:object="${searchRule}">
            <input name="id" th:field="*{id}" type="hidden">
            <div class="col-xs-12">
                <div class="form-group">
                    <label class="col-sm-2 control-label is-required">规则名称：</label>
                    <div class="col-sm-6">
                        <input name="ruleName" th:field="*{ruleName}" class="form-control" type="text">
                    </div>
                    <label class="col-sm-4 control-label" style="text-align: left">*名称相同的合并统计</label>
                </div>
            </div>

            <div class="col-xs-12">
                <div class="form-group">
                    <label class="col-sm-2 control-label is-required">事件类型：</label>
                    <div class="col-sm-10">
                        <div id="cxSelectEvtType" class="row">
                            <div class="col-sm-3">
                                <select id="evtTypeId1" name="evtTypeId1" class="type1 form-control m-b" th:data-value="*{evtTypeId1}"></select>
                            </div>
                            <div class="col-sm-3">
                                <select id="evtTypeId2" name="evtTypeId2" class="type2 form-control m-b" th:data-value="*{evtTypeId2}"></select>
                            </div>
                            <div class="col-sm-6">
                                <select id="evtTypeId3" name="evtTypeId3" class="type3 form-control m-b" th:data-value="*{evtTypeId3}"></select>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-xs-12">
                <div class="form-group">
                    <label class="col-sm-2 control-label">搜索文字：</label>
                    <div class="col-sm-6">
                        <input name="wordToSearch" class="form-control" type="text" th:field="*{wordToSearch}">
                    </div>
                    <label class="col-sm-4 control-label" style="text-align: left">*多个文字用逗号隔开；为空时包含分类下所有事件，且二级分类不能为空</label>
                </div>
            </div>
        </form>
    </div>
    <th:block th:include="include :: footer" />
    <th:block th:include="include :: datetimepicker-js" />
    <th:block th:include="include :: select2-js" />
    <th:block th:include="include :: jquery-cxselect-js" />
    <script th:inline="javascript">
        var prefix = ctx + "system/searchRule";

        $(function() {
            // 事件类型下拉框
            $.cxSelect.defaults.url = ctx + "system/type/evtTypeCxSelectData";
            $('#cxSelectEvtType').cxSelect({
                selects: ['type1', 'type2', 'type3'],
                jsonValue: 'v',
                nodata: 'none'
            });
        });

        $("#form-searchRule-edit").validate({
            focusCleanup: true
        });

        function submitHandler() {
            if ($.validate.form()) {
                $.operate.save(prefix + "/edit", $('#form-searchRule-edit').serialize());
            }
        }

        $("input[name='addTime']").datetimepicker({
            format: "yyyy-mm-dd",
            minView: "month",
            autoclose: true
        });
    </script>
</body>
</html>